@charset "utf-8";

@function px($px){
    @return (px/2);
}
$fontsize:40;
@function r($px){
    @return $px/$fontsize * 1rem;
}
.web{
    width: 100%;
    height: 100%;
    position: relative;
    
    section{
        width: 100%;
        position: absolute;
        top: 0px;
        .secBox{
            width: 100%;
            height: r(105);
            input{
                width: 90%;
                height: 80%;
                margin-top:r(12.5);
                margin-left: 5%;
                font-size: r(40);
                padding-left: r(100);
                border: 1px solid #c1c1c1;
                border-radius: 10px;
            }
            .icon-cha{
                font-size: r(50);
                color: #d2d2d2;
                position: absolute;
                top: r(25);
                left: r(652);
                background: #FFFFFF;
            }
            .icon-fangdajing{
                font-size: r(60);
                position: absolute;
                top: r(20);
                left: r(50);
                color: #d2d2d2;
            }
        }//secBox
        .secBox2{
            width: 100%;
            height:r(130);
            border-bottom: 1px solid #e3e3e3;
            border-top: 1px solid #e3e3e3;
            margin-top:r(5) ;
            .secBox2-1{
                width:r(91);
                height: r(91);
                margin-top:r(20);
                margin-left:r(20);
                img{
                    width: 100%;
                    height: 100%;
                }
            }
            .secBox2-2{
                margin-left: r(30);
               p{
                   font-size: r(30);
                   color: #6e6e6e;
                   margin-top: r(15);
                   letter-spacing: 1px;
               } 
               img{
                   width: r(45);
                   height: r(45);
                   margin-top: r(10);
                   margin-right: r(20);
               }
            }
            .secBox2-3{
                width: r(155);
                height: r(60);
                margin-right: r(20);
                margin-top: r(30);
                input{
                    width: 100%;
                    height: 100%;
                    border: 1px solid #c1c1c1;
                    font-size: r(20);
                    color: #666666;
                    background: #FFFFFF;
                    border-radius: 5px;
                    text-align: center;
                    line-height: r(60);
                }
            }
        }//secBox2
        .secBox3{
            width: 100%;
            height: r(200);
            border-bottom: r(30) solid #f3f4f6;
            ul{
                a{
                    li{
                        width: r(145);
                        height: r(145);
                        float: left;
                        border: 1px solid #E3E3E3;
                        margin-top: r(23);
                        margin-left: r(30);
                        img{
                            width: 100%;
                            height: 100%;
                        }
                    }
                }
            }
        }//secBox3
    }
}
.web2{
    width: 100%;
    height: 100%;
    background:rgba(0,0,0,.7);
    position: absolute;
    top: 0px;
    z-index: 999;
    display: none;
    
//  margin-top: r(145);
    .sectionBox{
        width: r(540);
        height: r(540);
        background: #FFFFFF;
        border-radius:5px ;
        margin-left: r(105);
        margin-top: r(300);
        h3{
            font-size: r(45);
            text-align: center;
            padding-top: r(20);
        }
        .sectionBox1{
            width: 90%;
            height: r(70);
            margin: 0 auto;
            border: 1px solid #c1c1c1;
            font-size: r(25);
            border-radius: 5px;
            line-height: r(70);
            padding-left: r(20);
            margin-top: r(27);
           
            input{
                float: right;
                height: 100%;
                width: r(330);
                font-size: r(25);
                border: none;
                margin-left: r(1);
            }
        }
        
        .sectionBox4{
            width: 100%;
            height: r(80);
            margin-top:r(30) ;
            input{
                width: 70%;
                height: r(80);
                margin-left: 15%;
                border: 1px solid #D62D31;
                border-radius: 5px;
                background: #D62D31;
                font-size: r(40);
                color: #FFFFFF;
            }
        }
     
    }
}
.web3{
    width: r(250);
    height: r(185);
    position: absolute;
    display: none;
    top: r(415);
    left: 33.8%;
    .sectBox{
        width: r(250);
        height: r(175);
        background:rgba(0,0,0,.7);
        margin: 0 auto;
        padding-top:10px ;
        border-radius: 5px;
        .icon-xiaolian{
            font-size: r(70);
            color: #dadada; 
            margin-left: r(85); 
        }
        .icon-cha{
            font-size: r(40);
            color: #FFFFFF;
            position: absolute;
            top: 0;
            left: 83%;
        }
        p{
            font-size: r(30);
            color: #dadada;
            text-align: center;
            margin-top: 20px;
        }
    }
}
